<template>
    <div class="page-content page-content-inner">
        <h3 class="page-title"> 选择表单类型 <small></small></h3>

        <div class="search-page search-content-3">
            <div class="row">
                <div class="col-md-2 col-sm-2 col-xs-6">
                    <router-link :to="{name: 'form-create', query: {use_type: 0, pid: pid, operType: operType}}"
                                 tag="div"
                                 class="color-demo tooltips">
                        <div class="color-view bg-white bg-font-white bold uppercase">
                            网站内容
                            <p>网站使用，内容使用</p>
                        </div>
                    </router-link>
                </div>
                <div class="col-md-2 col-sm-2 col-xs-6">
                    <router-link :to="{name: 'form-create', query: {use_type: 1, pid: pid, operType: operType}}"
                                 tag="div"
                                 class="color-demo tooltips">
                        <div class="color-view bg-white bg-font-white bold uppercase">
                            问卷调查
                            <p>问卷调查</p>
                        </div>
                    </router-link>
                </div>
                <div class="col-md-2 col-sm-2 col-xs-6">
                    <router-link :to="{name: 'form-create', query: {use_type: 2, pid: pid, operType: operType}}"
                                 tag="div"
                                 class="color-demo tooltips">
                        <div class="color-view bg-white bg-font-white bold uppercase">
                            考试试卷
                            <p>考试试卷</p>
                        </div>
                    </router-link>
                </div>
                <div class="col-md-2 col-sm-2 col-xs-6">
                    <router-link :to="{name: 'form-create', query: {use_type: 3, pid: pid, operType: operType}}"
                                 tag="div"
                                 class="color-demo tooltips">
                        <div class="color-view bg-white bg-font-white bold uppercase">
                            评价
                            <p>评价</p>
                        </div>
                    </router-link>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    import { mapState, mapActions } from 'vuex';
    import axios from 'axios';

    export default {
        data() {
            let vm = this;
            return {
                pid: 0
            }
        },
        components: {

        },
        created: function () {
            this.pid = this.$route.query.pid;
            this.operType = this.$route.query.operType;
        },
        mounted: function () {
            this.pid = this.$route.query.pid;
            this.operType = this.$route.query.operType;
        },
        watch: {
            '$route' (to, from){
                // this.refresh();
            },
        },
        computed: mapState([
            /*'mainMenu',
             'menuHide'*/
        ]),
        methods: {
            ...mapActions([

            ]),
            refresh() {

            }
        }
    }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style>

    .page-content .page-content-wrapper .page-content.page-content-inner{
        background: #F1F1F1 !important;
        margin: -5px -20px -30px -20px !important;
        padding: 30px !important;
    }

    .search-content-3 .tile-container>.tile-title{
        padding:8px;
    }
    .search-content-3 .tile-container>.tile-title>.tile-desc>p{
        margin-top:5px;
    }
    .search-content-3 .tile-container>.tile-thumbnail{
        background:#DDD;
    }

    .color-demo .color-view{
        padding: 35px 5px;
        text-align: center;
        font-size: 16px;
        height:138px;
    }

    .color-demo .color-view p{
        margin: 0;
        font-size: 12px;
        margin-top: 8px;
        font-weight: normal;
        margin-bottom: -8px;
        color: #CCC;
    }
    .color-demo .color-view p.code{
        color: #999;
    }
</style>
